<template>
    <div class="app">
        <uploader
			manualDel
			@delImage="remove"
            :max-count="maxCount"
            :imgList.sync="imgList"
            @currentUpload="uploadImg"
            :size="200"/>
    </div>
</template>

<script>
import $apiCompany from '@/api/company'
import uploader from '@/components/App_uploader'
import { upLoadImg } from '@/utils/common'
export default {
	name: 'Brand',
	inject: ['saveSuccee', 'queryData'],
	components: {
		uploader
	},
	data() {
		return {
			imgList: [],
			maxCount: 8,
			listimg: [],
			query: null
		}
	},
	mounted() {
		this.query = this.queryData()
		this.init()
	},
	methods: {
		init() {
			$apiCompany.getBrand({
				company_id: this.query.owner_user_id
			})
				.then((res) => {
					if (res.status == 'success') {
						this.imgList = res.data.map((i) => i.images)
						this.listimg = res.data
					} else {
						uni.showToast({
							title: res.errors.message,
							icon: 'none'
						})
					}
				})
		},
		addImg(data) {
			$apiCompany.addBrand({
				images: data
			})
				.then((res) => {
					if (res.status == 'success') {
						this.init()
						this.saveSuccee()
					} else {
						uni.showToast({
							title: res.errors.message,
							icon: 'none'
						})
					}
				})
		},
		uploadImg(res) {
			this.addImg(res[0])
		},
		deleteImg(index) {
			$apiCompany.deleteBrand({
				id: this.listimg[index].id
			}).then((res) => {
				if (res.status == 'success') {
					this.listimg.splice(index, 1)
					this.imgList.splice(index, 1)
				} else {
					uni.showToast({
						title: res.errors.message,
						icon: 'none'
					})
				}
			})
		},
		remove(index) { // 删除
			uni.showModal({
				title: '提示',
				content: '你确定要删除吗?',
				success: (res) => {
					if (res.confirm) {
						this.deleteImg(index)
					} else if (res.cancel) {
						console.log('用户点击取消')
					}
				}
			})
		}
	}
}
</script>

<style lang="scss" scoped>
    .app {
        margin-top: 47px;
    }
</style>
